﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-trasitional.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>编辑角色</title>
    <link rel="stylesheet"
          href="/static/css/table.css" type="text/css"/>
    <script type="text/javascript" src="/static/javascript/jquery-1.7.2.js"></script>
    <script type="text/javascript" src="/static/javascript/right_list_information.js"></script>
    <style type="text/css">
        .parent {
            margin-left: 50px;
        }
    </style>
    <!--以下3个js库必须按照顺序引入-->
    <!--vue脚本库-->
    <script type="text/javascript"
            src="/static/js/vue-3.2.4.global.js">
    </script>
    <script type="text/javascript"
            src="/static/js/axios-0.18.0.min.js">
    </script>
    <!--我们自己封装的axios函数库 -->
    <script type="text/javascript"
            src="/static/js/axios-helper.js">
    </script>
</head>
<body id="app">
<form id="powerAction!doModifyRight" name="powerAction!doModifyRight" action="success.html" method="post">
    <table width="100%">
        <tr>
            <td>
                <font color="black">您正在做的业务是：人力资源--权限管理--编辑角色</font>
            </td>
        </tr>
        <tr>
            <td align="right">
                <input type="submit" id="powerAction!doModifyRight_0" value="&#20445;&#23384;" class="BUTTON_STYLE1"/>

                <input type="button" value="返回" class="BUTTON_STYLE1"
                       onclick="history.back()">
            </td>
        </tr>
    </table>
    <table width="100%" border="1" cellpadding=3 cellspacing=1
           bordercolorlight=#848284 bordercolordark=#eeeeee
           class="TABLE_STYLE1">
        <tr>
            <td class="TD_STYLE1">角色编号</td>
            <td class="TD_STYLE2">2</td>
            <td class="TD_STYLE1">角色名称</td>
            <td class="TD_STYLE2">
                <input type="text" class="INPUT_STYLE2" value="人事经理"
                       name="sysRole.roleName"/>
                <input type="hidden" name="sysRole.roleId" value="2"/>
            </td>
        </tr>
        <tr>
            <td class="TD_STYLE1">角色说明</td>
            <td class="TD_STYLE2">
                <input type="text" class="INPUT_STYLE2" value=""
                       name="sysRole.roleDesc"/>
            </td>
            <td class="TD_STYLE1">角色是否可用</td>
            <td class="TD_STYLE2">
                <select name="sysRole.roleFlag" id="powerAction!doModifyRight_sysRole_roleFlag">
                    <option value="false">否</option>
                    <option value="true" selected="selected">是</option>


                </select>

            </td>
        </tr>
    </table>
    <hr/>

    <table class="grandfather" v-for="fuc in funList">
        <tr>
            <td>
                <input type="checkbox" :value="fuc.fid"
                       class="grandfather_ck"/>
                {{fuc.fname}}
                <table class="parent" v-for="fuc1 in fuc.children">
                    <tr>
                        <td>
                            <input type="checkbox" :value="fuc1.fid"
                                   class="parent_ck"/>
                            {{fuc1.fname}}
                            <table class="children" >
                                <tr>
                                    <td v-for="fuc2 in fuc1.children">
                                        <input type="checkbox" :value="fuc2.fid"
                                                class="children_ck"/>
                                        {{fuc2.fname}}
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
    <hr/>
</form>


</body>


<script type="module">
    Vue.createApp({
        data(){
            return{
                //权限列表
                funList:[],
                role:{
                    //角色ID
                    rid:null,
                    rname:null,
                    rdesc:null,
                    isDisable:null
                }
            }
        },
        created(){
            requestGet("/role/queryById",{
                rid:sessionStorage.getItem("rid")
            }).then((data)=>{
                console.info(data);
            })
            ,
            //初始化权限列表
            requestGet("/functions/queryList",{
                parentId:0
            }).then((data)=>{
                // console.info(data);
                this.funList=data;
            })
        },
        method:{

        }
    }).mount("#app");
</script>


</html>
